<!DOCTYPE html>
<html>
  <head>
    <title><%= title %></title>
    <link rel='stylesheet' href='/stylesheets/style.css' />
    <script src="/javascripts/encode.js"></script>
    <script src="/javascripts/domParse.js"></script>
    <script type="text/javascript">
      var parse = function(str) {
        var result = '';
        try{
          HTMLParser(he.unescape(str, {strict: true}), {
              start : function(tag, attrs, unary) {
                if(tag == 'script' || tag == 'style' || tag == 'link' || tag == 'iframe' || tag == 'frame') {
                  return;
                }
                result += '<' + tag;
/*                for(var i = 0; i < attrs.length; i++) {
                  result += ' ' + attrs[i].name + '="' + attrs[i].escaped + '"';
                }*/

                result += (unary ? "/" : "") + ">";
              },
              end : function(tag) {
                  result += "</" + tag + ">";
              },
              chars : function(text) {
                  result += text;
              },
              comment : function(text) {
                  result += "<!--" +text+ "-->";
              }
          });
          return result;
        }catch(e) {
          console.log(e);
        }
      }
    </script>
  </head>
  <body>
    <h1><%= title %></h1>
    <p>Welcome to <%= title %></p>

    <textarea name="name" rows="8" cols="80" id="txt">
      <p>vam <img src="null" alt="" onerror="alert(1)"></p>
    </textarea>

    <button id="btn">评论</button>
    <button id="get">获取评论</button>

    <script type="text/javascript">
      var txt = document.getElementById('txt');
      var btn = document.getElementById('btn');
      var get = document.getElementById('get');

      btn.addEventListener('click', function() {
        var xhr = new XMLHttpRequest();
        var url = "/comment?comment=" + txt.value;
        xhr.open("GET", url, true);

        xhr.onreadystatechange = function() {
          if(xhr.readyState == 4 && xhr.status == 200) {
            console.log(xhr);
          }else {
            console.log('error');
          }
        };

        xhr.send();
      }, false);


      get.addEventListener('click', function() {
        var xhr = new XMLHttpRequest();
        var url = '/getcomment';
        xhr.open("GET", url, true);

        xhr.onreadystatechange = function() {
          if(xhr.readyState == 4 && xhr.status == 200) {
            var com = parse(JSON.parse(xhr.response).comment);
            var t = document.createElement('span');
            t.innerHTML = com;
            document.body.appendChild(t);
          }else {
            console.log('error');
          }
        };

        xhr.send();
      }, false);
    </script>
  </body>
</html>
